<template>
	<view>
		<template v-if="!loginStatus">
		<view class="flex align-center justify-center py-2 font">
			登陆体验更多功能
		</view>
		<view class="flex align-center justify-center py-2 font text-main">
			账号/手机登录<text class="ml-2 iconfont icon-jinru" @click="openLogin"></text>
		</view>
		</template>
	   <view v-else class="flex align-center p-2" hover-class="bg-light">
		   <image :src="user.avatar" style="width: 100rpx;height: 100rpx;" class="border-circle"></image>
		   <view class="flex flex-1 px-2">
			   <text class="font-lg font-weight-bold text-dark">{{user.username}}</text>
		   </view>
		   <text class="iconfont icon-jinru"></text>
	   </view> 
	   </navigator>
        <uni-list-item title="我的消息" @click="openMessage" :clickable="loginStatus" showArrow showExtraIcon></uni-list-item>
	</view>
</template>

<script>
	 import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
	 import { mapState } from 'vuex';
	export default {
		components:{
			uniListItem
		},
		data() {
			return {
			user:{
			  avatar:'',
		      username:''		  
			}
			}
		},
		onNavigationBarButtonTap(){
			uni.navigateTo({
			  url:'../user-set/user-set'	
			})
		},
		computed:{
			...mapState({
				loginStatus:state=>state.loginStatus
			})
		},
		mounted() {
			if(this.loginStatus){
				let userInfo = JSON.parse(uni.getStorageSync("userInfo"));
				this.user.avatar = userInfo.avatar;
				this.user.username = userInfo.userName;
			}
		},
		methods: {
			openLogin(){
				uni.navigateTo({
					url:'../login/login',
				})
			},
			openMessage(){
				console.log("222")
				uni.navigateTo({
					url:'../message/message'
				})
			}
		}
	}
</script>

<style>

</style>
